/**
 * @file
 * @auth jinguangguo
 * @date 2016/12/29
 */

import Vue from 'vue';
import tpl from './tpl.html';

import {REG_PHONE} from '../../../../grsc-base/common/constants';
import Validator from '../../../../grsc-base/component/Validator/main';
import FileUpload from '../../../../grsc-base/component/Upload/Fileupload.vue';
import Success from './component/success.vue';
import service from '../service';

export default Vue.extend({
    name: 'complain',
    template: tpl,
    data(){
        return {
            isRequesting: false,
            payTypeList: [
                {
                    val:'ALIPAY',
                    text:'支付寶'
                },
                {
                    val:'BANK',
                    text:'銀行卡'
                }],
            complainReasons: ['我已打款給賣家，賣家未打幣','我未收到買家的付款','買家付款金額不符','賣家打幣數量不符','其他原因（備註說明）'],
            transOrderId: this.$route.params.transOrderId || '',
            certificatePhotoTip: false,

            certificatePhotoSrc:'../img/certificate1.jpeg',
            certificatePhotoSrcOri:'../img/certificate1.jpeg',
            form: {
                reason: '',
                phone: '',
                payType: '',
                payNo: '',
                certificatePhoto:[],
                remark: '',
            },
            rules: {
                reason: {
                    required: true,
                    requiredTip: '請輸入申訴原因',
                },
                phone: {
                    required: true,
                    requiredTip: '請輸入您的聯繫方式',
                    pattern: REG_PHONE,
                    patternTip: '賬號格式錯誤，請重新輸入'
                },
                payType: {
                    // required: true,
                    // requiredTip: '請選擇付款方式',
                },
                payNo: {
                    // required: true,
                    // requiredTip: '請輸入交易流水號',
                },
                remark: {
                    required: true,
                    requiredTip: '請輸入備註信息',
                    maxlength: '120',
                    maxlengthTip: '最多輸入120個字符'
                }
            },

            source: this.$route.query.source,
            isShowSuccess: false,
        }
    },
    created() {

    },
    mounted(){


    },
    components: {
        Validator,
        FileUpload,
        Success
    },
    methods: {
        submit(){
            if (this.rules.$checkAll() === false) {
                return;
            } else {
                if (this.form.certificatePhoto.length < 1) {
                    this.capture = '';
                }
            }

            this.isRequesting = true;
            let param = {
                transOrderId: this.transOrderId,
                complainReason: this.form.reason,
                phone: this.form.phone,
                payType: this.form.payType,
                payNo: this.form.payNo,
                capture: this.form.certificatePhoto,
                remark: this.form.remark
            };
            service.orderComplaint(param).done(rep => {
                if (rep.code === window.CODE.SUCCESS) {
                    this.isShowSuccess = true;
                }else{
                    window.error(rep.msg);
                }
            }).always(() =>{
                this.isRequesting = false;
            });
        },

        deleteFile(fileList, listName){
            this.form[listName]=fileList;
            this[listName+'Src'] = this[listName+'SrcOri'];
        },

        onFileClick(listName){
            this[listName+'Tip'] = false;
        },

        onFileUpload: function (fileList, listName) { // url id
            this.form[listName] = fileList;
            this[listName+'Src'] = '/exchangeApi/common/photo?name='+fileList[0];
        },

        returnOrderList(){
            this.isShowSuccess = false;
            this.$router.push({name: this.source, query: {status: 'COMPLAINNING'}});
        }
    }
});
